<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Layui实时视频播放</title>
  <link rel="stylesheet" href="/layui/css/layui.css" media="all">
</head>
<body>
 
<video id="live-video" controls preload="auto" width="600" height="400" x5-playsinline="" playsinline="" webkit-playsinline="" poster="your-video-poster.jpg">
  <!-- 这里可以放上你的视频流地址 -->
  <source src="http://61.240.141.84:7002/main/camera_157505/index.m3u8" type="application/x-mpegURL">
</video>
 
<script src="/layui/layui.all.js"></script>
<script src="/js/core.util.js"></script>

<script>
layui.use('video', function(){
  var video = layui.video;
  
  // 初始化视频播放
  video.init('live-video', {
    // 设置视频属性
    'width': '600px',
    'height': '400px'
  });
  
  // 你可以在这里添加额外的事件监听，例如：
  // video.on('play(event)', function(item){ console.log('play', item); });
});
</script>
 
</body>
</html>